﻿<!doctype html>
<html>
<head>
    <title>微街秀 >上传截图</title>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width,height=device-height,inital-scale=1.0,maximum-scale=1.0,user-scalable=no;" />
    <meta name="apple-mobile-web-app-capable" content="yes" />
    <meta name="apple-mobile-web-app-status-bar-style" content="black" />
    <meta name="format-detection" content="telephone=no" />
    <link href="css/base.css" rel="stylesheet" type="text/css" />
    <link href="plugins/bootstrap/css/bootstrap.min.css" rel="stylesheet" type="text/css" />
    <link href="plugins/bootstrap-fileinput-master/css/fileinput.min.css" rel="stylesheet"
        type="text/css" />
    <link rel="stylesheet" type="text/css" href="css/css.css" />
    <style>
        #upimgs{width: 90%;height: 100%; max-height:400px;}
        .btn-file{text-align: center;margin-bottom: 10px;}
        .Centen{width: 60%;margin: 10px auto 25px auto;}
        .Uploadimg{width: 90%;margin: 20px auto 10px auto;text-align: center;height: 40px;line-height: 40px;border: #F37B0B 1px solid;border-radius: 5px;color: #F37B0B;font-size: 16px;}
        #ad_file{position: fixed;top: -100%;}
    </style>
</head>
<body>
    <form id="myform">
    <div class="wamtop">
        <div class="topleft" onclick="window.location.href='Makesh_4.html'">
            <img src="img/14.png"/>
        </div>
        <div class="topcententxt">
            上传截图</div>
    </div>
        <div class="Centen">
            <div>
                <div class="pt10">
                    <img id="upimgs" src="" />
                </div>
            </div>
            <input type="hidden" id="hftypeid" value="1"/>
            <span style="color: #8F8F8F; font-size: 12px;"> 此图为样本，参照此图进行截图。<br>
                请拉到通讯录底部，显示多少位联系人再截图。 </span>
        </div>
    <div class="Uploadimg">
        上传</div>
   
    <div style="width: 90%;margin: 20px auto 0 auto; color: #8F8F8F;line-height: 22px;">
        <div>说明：</div>
        <div>
            1、分享主须对在微街秀注册信息的真实性、合法性、有效性承担全部责任。
        </div> 
        <div>
            2、微街秀有权对分享主使用微街秀的情况进行审查和监督，分享主不得弄虚作假或不当使用账户，一经发现，微街秀有权暂停或终止分享主使用微街秀的权利，以及没收微街秀账户的费用，且不作任何补偿。
        </div>
        <br>
    </div>
    <script src="js/jquery-2.1.4.min.js" type="text/javascript"></script>
    <script src="js/jquery-form.js" type="text/javascript"></script>
    <script src="plugins/bootstrap/js/bootstrap.min.js" type="text/javascript"></script>
    <script src="plugins/bootstrap-fileinput-master/js/fileinput.min.js" type="text/javascript"></script>
    <script src="plugins/bootstrap-fileinput-master/js/fileinput_locale_zh.js" type="text/javascript"></script>
    <script src="js/jquery-submit.js" type="text/javascript"></script>
    <script src="js/dialog.js" type="text/javascript"></script>
    <script src="js/ajax-upload.js" type="text/javascript"></script>
    <script src="js/ajax-data.js" type="text/javascript"></script>
        <script src="js/base.js" type="text/javascript"></script>
        <script src="http://res.wx.qq.com/open/js/jweixin-1.0.0.js"></script>
        <script src="js/sha.js" type="text/javascript"></script>
        <script src="js/sign.js" type="text/javascript"></script>
    <script type="text/javascript">
        var logo = "";
        var access_token = "";
        $(function () {           
            load();
            
            var param = {};
            AjaxStart("ajax/WxJsApiAccessToken.ashx?get", param, function (data) {
                if (data.code == 0) {
                    var s = sign(data.item.JsApi_Ticket, location.href.split('#')[0]);
                    access_token = data.item.Access_Token;
                    wx.config({
                        debug: false, // 开启调试模式,调用的所有api的返回值会在客户端alert出来，若要查看传入的参数，可以在pc端打开，参数信息会通过log打出，仅在pc端时才会打印。    
                        appId: data.item.AppId, // 必填，公众号的唯一标识    
                        timestamp: s.timestamp, // 必填，生成签名的时间戳    
                        nonceStr: s.nonceStr, // 必填，生成签名的随机串    
                        signature: s.signature,// 必填，签名，见附录1    
                        jsApiList: ['chooseImage', 'uploadImage']
                    });
                }
                else
                    Alert(data.msg);
            });
        });
        wx.ready(function () {
            $(".Uploadimg").click(function () {
                wx.chooseImage({
                    count: 1, // 默认9
                    sizeType: ['original', 'compressed'], // 可以指定是原图还是压缩图，默认二者都有
                    sourceType: ['album', 'camera'], // 可以指定来源是相册还是相机，默认二者都有
                    success: function (res) {
                        console.log(res);
                        var imgId = res.localIds[0]; // 返回选定照片的本地ID列表，localId可以作为img标签的src属性显示图片
                        wx.uploadImage({
                            localId: imgId, // 需要上传的图片的本地ID，由chooseImage接口获得
                            isShowProgressTips: 1, // 默认为1，显示进度提示
                            success: function (res) {
                                var serverId = res.serverId; // 返回图片的服务器端ID
                                var url =
                                    "http://file.api.weixin.qq.com/cgi-bin/media/get?access_token=" + access_token + "&media_id=" + serverId;
                                var upapi = "/Client2/Ajax/Upload.ashx?WxImg&url="+encodeURIComponent(url);
                                console.log(upapi);                                //上传图片
                                $("#myform").ajaxSubmit({
                                    type: 'post',
                                    dataType: "json",
                                    url: upapi,
                                    success: function (data) {
                                        console.log(data);
                                        wait.dismiss();
                                        addContentImg(data.item);
                                        logo = data.item;
                                    },
                                    error: function (XmlHttpRequest, textStatus, errorThrown) {
                                        wait.dismiss();
                                    }
                                });
                            }
                        });
                    }
                });
            });
            
        });
        function load() {
            if (!islogin()) { window.location.href = 'login.html'; return; }
            AjaxStart("ajax/fc_setting.ashx?Get", "", function (data) {
                console.log(data);
                if (data.code == 0) {
                    if (data.item.wx_picurl == null || data.item.wx_picurl == "") {
                        $("#upimgs").attr("src", "img/Makeimg/21(1).png");
                    } else {
                        $("#upimgs").attr("src", data.item.wx_picurl);
                    }
                    
                }
            });
        }
        
        function addContentImg(src) {
            console.log(src);
            var area1 = getStorage("area1");
            var area2 = getStorage("area2");
            var area3 = getStorage("area3");

            if (area1 == null) {
                area1 = "";
            }
            if (area2 == null) {
                area2 = "";
            }
            if (area3 == null) {
                area3 = "";
            }
            console.log("start setting");
            //更新微信好友列表截图
            AjaxStart("ajax/fc_setting.ashx?setting", "&wx_picurl=" + src + "&area1=" + area1 + "&area2=" + area2 + "&area3=" + area3, function (data) {
               
                if (data.code == "0") {
                    $("#upimgs").attr("src", src);
                    Alert("上传成功!");
                } else {
                    Alert(data.msg);
                }
                    
            });
        }
    </script>
    </form>
</body>
</html>
